﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>定位图元</title>
    
    
    <script src="js/jquery-1.8.2.min.js"></script>
    <script src="js/ControlImageWrapper.js"></script>

    <style>
        .display-wrapper {
            width: 636px;
            height: 369px;
            /*background-image: url(images/pipeline1.png);*/
            background-repeat: no-repeat;
            
        }
        .display-graphic {
            position: relative;
            /*top: 200px;
            left: 200px;*/
            font-weight: bolder;
        }
        .display-graphic-content {
            color: red;
        }
    </style>
</head>
<body>
    <h1>定位图元</h1>
    
    <div id="pipelineDisplay" >
        <div class="display-graphic">
            <div class="display-graphic-content">压力</div>
            <div class="display-graphic-content">0.71MPa</div>
        </div>
        
    </div>
    
    <script>
        $(function () {
            //初始化
            var param= {
                divId:"pipelineDisplay", 
                backgroundImage:"images/pipeline1.png"
            }
            var displayWrapper = new ControlDisplayWrapper(param);
            //添加图元
            var graphicParam = {
                className: "display-graphic",
                title: "温度",
                content: "30度",
                left: "200",
                top: "200"
            }
            displayWrapper.add(graphicParam);
        });
    </script>
</body>
</html>
